<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="sys" uri="/menutaglib"%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<title>${sessionScope.web_name}</title>
	<meta content="width=device-width, initial-scale=1.0" name="viewport" />
	<meta content="" name="description" />
	<meta content="" name="author" />
	<link rel="stylesheet" id='style_color' href="<%=request.getContextPath()%>/resources/assets/plugins/system/css/${sessionScope.web_style}.css" type="text/css"/>
	<script type="text/javascript" src="<%=request.getContextPath()%>/resources/assets/common/js/constants.js"></script>
	<script type="text/javascript" src="<%=request.getContextPath()%>/resources/assets/system/js/common/fscapp_sys.js"></script>
	<script src="<%=request.getContextPath()%>/resources/assets/plugins/echarts/echarts.js" type="text/javascript"></script>
	<script type="text/javascript" src="<%=request.getContextPath()%>/resources/assets/plugins/system/js/jquery.bootpag.min.js"></script>
	<script src="<%=request.getContextPath()%>/resources/assets/system/js/info/MyCharts.js"></script>
	<link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/resources/assets/plugins/system/css/datepicker.css" />
	<script type="text/javascript" src="<%=request.getContextPath()%>/resources/assets/plugins/system/js/bootstrap-datepicker.js"></script>
	<script type="text/javascript" src="<%=request.getContextPath()%>/resources/assets/plugins/system/js/daterangepicker.js"></script>
</head>
<body class="page-header-fixed">
	<jsp:include page="../common/systemUserSelfHeader.jsp"></jsp:include>

	<div class="page-container row-fluid">
			<div class="page-sidebar nav-collapse collapse">
				<!-- BEGIN SIDEBAR MENU -->
				<ul class="page-sidebar-menu">
					<!-- BEGIN SIDEBAR TOGGLER BUTTON -->
					<sys:sysNav ctgLevelOne="sysUser" ctgLevelTwo="messageStat" />
				</ul>
					<!-- END SIDEBAR MENU -->
			</div>
		<div class="page-content">
			<div class="container-fluid">
				<!-- BEGIN PAGE HEADER-->
				<div class="row-fluid crumbs">
					<div class="beginPageHearderBg_1"></div>
					<div class="beginPageHearderBg_2"></div>
					<div class="page-title page-title-style"><i class="icon-bar-chart"></i>培训相关信息统计管理</div>
					<div class="page-title-desc"><i class="fa fa-info-circle"></i>培训相关信息(*)</div>
					<div class="span12 breadcrumb-style">
						<ul class="breadcrumb">
							<li>
								<i class="icon-home"></i>
								<a href="${sessionScope.web_home}">首页</a>
								<i class="icon-angle-right"></i>
							</li>
							<li>
								<a href="#">用户</a>
								<i class="icon-angle-right"></i>
							</li>
							<li><a href="#">培训相关信息统计</a></li>
						</ul>
						<!-- END PAGE TITLE & BREADCRUMB-->
					</div>
				</div>
				<div class="clearfix"></div>
					<div class="row-fluid">
						<div class="span6">
							<!-- BEGIN PORTLET-->
							<div class="portlet solid bordered light-grey">
								<div class="portlet-title">
									<div class="caption">
										<i class="icon-bar-chart"></i>科目报名人数统计信息
									</div>
									<div class="tools">
									</div>
								</div>
								<div class="portlet-body">
									<%-- <div id="site_statistics_loading">
										<img src="<%=request.getContextPath()%>/resources/assets/plugins/system/image/loading.gif" alt="loading" />
									</div> --%>
									<div id="site_statistics_content" >
										<div class="input-append date date-picker" data-date="12-02-2017" data-date-format="yyyy" data-date-viewmode="years">
											<input class="m-wrap m-ctrl-medium date-picker" id="classTime" readonly="" size="16" type="text" value=""><span class="add-on"><i class="icon-calendar"></i></span>
										</div>
										<div id="site_statistics" class="chart"></div>
									</div>
								</div>
							</div>
							<!-- END PORTLET-->
						</div>

						<div class="span6">
							<!-- BEGIN PORTLET-->
							<div class="portlet solid light-grey bordered">
								<div class="portlet-title">
									<div class="caption">
										<i class="icon-bullhorn"></i>培训机构开班培训科目统计 
									</div>
								 	<div class="tools">
									</div>
								</div>
								<div class="portlet-body">
									<div class="input-append date date-picker" data-date="12-02-2017" data-date-format="yyyy" data-date-viewmode="years">
										<input class="m-wrap m-ctrl-medium date-picker" id="classTime2" readonly="" size="16" type="text" value=""><span class="add-on"><i class="icon-calendar"></i></span>
									</div>
									<div id="number" style="height: 400px;"></div>
								</div>
							</div>
							<!-- END PORTLET-->
						</div>
					</div>
					<div class="clearfix"></div>
					
					
				<div class="row-fluid">
						<div class="span6">
							<!-- BEGIN REGIONAL STATS PORTLET-->
							<div class="portlet">
								<div class="portlet-title">
									<div class="caption">
										<i class="icon-globe"></i>通过率统计信息
									</div>
									<div class="tools">
										<a href="" class="collapse"></a> 
										<a href="#" class="reload"></a> 
									</div>
								</div>
								<div class="portlet-body">
									<div id="region_statistics_loading" class="hide">
										<img src="<%=request.getContextPath()%>/resources/assets/plugins/system/image/loading.gif" alt="loading" />
									</div>
									<div id="region_statistics_content" class="">
										<div class="btn-toolbar">
										</div>
										<div class="tabbable tabbable-custom">
											<ul class="nav nav-tabs">
												<li class="active"><a href="#tab_1_1" data-toggle="tab">机构通过率统计图</a></li>
												<li><a href="#tab_1_2" data-toggle="tab">科目通过率列表</a></li>
											</ul>
											<div class="tab-content">
												<div class="input-append date date-picker" data-date="12-02-2017" data-date-format="yyyy" data-date-viewmode="years">
													<input class="m-wrap m-ctrl-medium date-picker" id="passId" readonly="" size="16" type="text" value=""><span class="add-on"><i class="icon-calendar"></i></span>
												</div>
												<div class="tab-pane active" id="tab_1_1">
													<div id="pass_statistics" class="chart"></div>
												</div>
												<div class="tab-pane" id="tab_1_2">
													<table id="rateDataTable" class="table table-striped table-bordered table-hover table-full-width">
														<thead>
															<tr>
																<th style="text-align:center">机构名称</th>
																<th style="text-align:center">科目</th>
																<th style="text-align:center">参加人数</th>
																<th style="text-align:center">通过人数</th>
																<th style="text-align:center">通过率</th>
															</tr>
														</thead>
														<tbody style="font-size: 15px;"></tbody>	
													</table>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
							<!-- END REGIONAL STATS PORTLET-->
						</div>
						
						<div class="span6">
							<!-- BEGIN PORTLET-->
							<div class="portlet solid light-grey bordered">
								<div class="portlet-title">
									<div class="caption">
										<i class="icon-bullhorn"></i>培训学员年龄段分析统计图(全部学员，包括临时学员)
									</div>
								 	<div class="tools">
									</div>
								</div>
								<div class="portlet-body">
									<div id="student" style="height: 400px;"></div>
								</div>
							</div>
							<!-- END PORTLET-->
						</div>
					</div>	
			</div>
			<div class="clearfix"></div>
		</div>
	</div>
	<!-- BEGIN FOOTER -->
	        <jsp:include page="../common/sysFooter.jsp"></jsp:include>
	<!-- END FOOTER -->
	<!-- BEGIN CORE PLUGINS -->
	<script>
		jQuery(document).ready(function() {
			App.init();
			TableAdvanced.init();
			UIModals.init();
			function handleDatePickers() {
			   	$('.date-picker').datepicker({  
				  	 format: 'yyyy',  
			         weekStart: 1,  
			         autoclose: true,  
			         startView: 2,  
			         maxViewMode: 2,
			         minViewMode:2,
			         forceParse: false,  			         
			         language: 'zh-CN'  
			    });
		    }
		  	handleDatePickers();
		   	var myDate = new Date();
		   	var year = myDate.getFullYear();
		   	$('.date-picker').val(year);
		});
	</script> 
	<script type="text/javascript" src="<%=request.getContextPath()%>/resources/assets/plugins/echarts/common.js"></script>
	<script src="<%=request.getContextPath()%>/resources/assets/system/js/user/messageStat.js" type="text/javascript"></script>
	<script>
        allFn.bottomFn_2("student");//左侧第一个图
</script>

	<!-- END THEME LAYOUT SCRIPTS -->
</body>
</html>